<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>联系我们</title>
    <link rel="stylesheet" href="./css/base.css" />
    <link rel="stylesheet" href="./iconfont/iconfont.css" />
    <link rel="stylesheet" href="./css/vant@2.12.54.css" />
    <link rel="stylesheet" href="./css/contactus.css" />
    <link rel="stylesheet" href="./css/nav.css" />
    <style>
        .my-v-cloak {
  display: none;
}
    </style>
</head>
<body>
    <div id="app" v-cloak class="my-v-cloak">
        <div class="nav">
            <ul class="list">
                <li class="item" @click="goToindex">
                  <img src="./img/ico1.png" alt="" >
                  <span>首页</span>
                </li>
                <li class="item" @click="goToproduct">
                  <img src="./img/ico2.png" alt="" >
                  <span>产品列表</span>
                </li>
                <li class="item" @click="goTovideo">
                  <img src="./img/ico3.png" alt="" >
                  <span>视频介绍</span>
                </li>
                <li class="item art" @click="goTocontactus">
                  <img src="./img/ico4_4.png" alt="" >
                  <span>联系我们</span>
                </li>
            </ul>
          </div>
          <div class="list_1">
            <div class="centent">
                <div class="logo">
                    <img :src="logo" alt="">
                </div>
                <div class="text">
                    <p class="f16">服务热线</p>
                    <p class="f16">{{aboutData.mobile}}</p>
                    <a :href="'tel:' + aboutData.mobile" class="btn">
                        立即拨打
                    </a>
                </div>
            </div>
        </div>
        <div class="list_1">
            <div class="centent">
                <div class="logo">
                    <img :src="logo" alt="">
                </div>
                <div class="text">
                    <p class="f16">我们的邮箱</p>
                    <p class="f16">{{aboutData.email}}</p>
                    <div class="btn">
                        复制
                    </div>
                </div>
            </div>
        </div>
        <div class="list_2">
            <div class="centent">
                <div class="qr_code">
                    <img :src="qrcodeImage" alt="">
                </div>
                <p class="f16">德龙农业官方公众号</p>
            </div>
        </div>

    
    </div>
    
</body>
<script src="./js/vue@2.7.14.js"></script>
  <script src="./js/element-ui@2.15.14.js"></script>
  <script src="./js/axios@1.5.0.min.js"></script>
  <script src="./js/vant@2.12.54.min.js"></script>
  <script src="./js/request.js"></script>
  <script>
    new Vue({
      el: "#app",
      data() {
        return {
            show:true,
            show_1:false,
            aboutData:[],
            logo:'',
            qrcodeImage:'',
            
        };
      },
      mounted() {
        document.getElementById('app').classList.remove('my-v-cloak');
        this.fetchData();
      },
      methods:{
        //获取数据
        fetchData() {
          const url = baseUrl + "/goods.Goods/about";
          axios({
            url: url,
            method: "post",
            params: {
              app_id: 10001,
            },
          })
            .then((res) => {
              // 处理响应结果
              this.aboutData = res.data.data.info;
              this.logo = res.data.data.info.logo.file_path;
              this.qrcodeImage = res.data.data.info.qrcodeImage.file_path;
              console.log(res.data.data.info);
            })
            .catch((error) => {
              // 处理错误
              console.error(error);
            });
        },
           
            goTocontactus(){
                window.location.href = "contactus.html";
            },
            goToindex(){
                window.location.href = "index.html";
            },
            goToproduct(){
                window.location.href = "product.html";
            },
            goTovideo(){
                window.location.href = "video.html";
            }
            
        }
    })
    Vue.use(vant);
  </script>

</html>